<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:c="http://java.sun.com/jsp/jstl/core"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:p="http://primefaces.prime.com.tr/ui"
                template="./../template/WorkspaceTemplate.xhtml">

    <ui:define name="top">

    </ui:define>

    <ui:define name="left">

    </ui:define>

    <ui:define name="right">

    </ui:define>

    <ui:define name="content">
        <style>
            .ui-state-highlight.ui-selected {
                color: blueviolet;
            }
            .ui-commandButton-wizard-selected{
                background-color: #D20005;
                font-weight: bold;
                color: #000000;
            }
            .ui-commandButton-wizard-unselected{
                background-color: #D20005;
                font-weight: bold;
                color: #AFAFAF;
            }
        </style>

        <h:form id="purchaseOrderForm" style="font-size: 85%">
            <h2>Edit Purchase Order</h2>
            <br/>

            <p:commandButton styleClass="ui-commandButton-wizard-unselected" value="Step 1: Select Customer and Order Items" image="ui-icon ui-icon-circle-triangle-e" />
            <p:commandButton styleClass="ui-commandButton-wizard-selected" value="Step 2: Enter Shipping Details and Special Discount" image="ui-icon ui-icon-circle-triangle-e"/>
            <p:commandButton styleClass="ui-commandButton-wizard-unselected" value="Step 3: Confirm" image="ui-icon ui-icon-circle-triangle-e"/>
            <br/>
            <br/>
            <p:panel>
                <p:messages />
                <br/>
                <br/>

                <h:outputText value="Order Items" style="font-weight: bold; font-size: 110%"/>
                <p:separator title="Order Items"/> 
                <br/>
                <p:dataTable var="oneIL" value="#{poManagerBean.purchaseOrder.itemLines}">
                    <p:column headerText="Product Type" rendered="#{oneIL.qtyOrderedCase != 0}">
                        <h:outputText value="#{oneIL.product.productType}" />
                    </p:column>
                    <p:column headerText="Quantity Ordered Case" rendered="#{oneIL.qtyOrderedCase != 0}">
                        <h:outputText value="#{oneIL.qtyOrderedCase}" />
                    </p:column>
                    <p:column headerText="Unit Price (SGD)" rendered="#{(oneIL.qtyOrderedCase != 0) &amp;&amp; (poManagerBean.purchaseOrder.currency)}">
                        <h:outputText value="#{oneIL.unitPriceSGD}" >
                            <f:convertNumber type="currency"/>
                        </h:outputText>
                    </p:column>
                    <p:column headerText="Unit Price (USD)" rendered="#{(oneIL.qtyOrderedCase != 0) &amp;&amp; (!poManagerBean.purchaseOrder.currency)}">
                        <h:outputText value="#{oneIL.unitPriceUSD}">
                            <f:convertNumber type="currency"/>
                        </h:outputText>
                    </p:column>
                    <p:column headerText="Member Discount" rendered="#{oneIL.qtyOrderedCase != 0}">
                        <h:outputText value="#{oneIL.memberDiscount}" />
                    </p:column>
                    <p:column headerText="Order Discount" rendered="#{oneIL.qtyOrderedCase != 0}">
                        <h:outputText value="#{oneIL.orderDiscount}" />
                    </p:column>
                    <p:column headerText="Special Discount" rendered="#{oneIL.qtyOrderedCase != 0}">
                        <h:inputText value="#{oneIL.specialDiscount}" />
                    </p:column>
                </p:dataTable>
                <br/>
                <br/>
                <br/>

                <h:outputText value="Shipping Terms" style="font-weight: bold; font-size: 110%"/>
                <p:separator title="Shipping Terms"/>
                <h:panelGrid id="panelgrid2" columns="6" cellpadding="10">
                    <h:outputLabel style="font-weight: bold" value="Freight On Board: "/>
                    <h:selectBooleanCheckbox id="fob" value="#{poManagerBean.purchaseOrder.freightOnBoard}"/>
                    <h:outputLabel style="font-weight: bold" value=""/>
                    <h:outputLabel style="font-weight: bold" value=""/>
                    <h:outputLabel style="font-weight: bold" value=""/>
                    <h:outputLabel style="font-weight: bold" value=""/>
                    <h:outputLabel style="font-weight: bold" value="Shipping Details: "/>
                    <h:selectOneRadio id="shipment" value="#{poManagerBean.purchaseOrder.fullShipment}">
                        <f:selectItem itemLabel="Full Shipment" itemValue="true"/>
                        <f:selectItem itemLabel="Partial Shipment" itemValue="false"/>
                        <p:ajax listener="#{poManagerBean.setDeliveryOrder}" update="shipmentDetails"/>
                    </h:selectOneRadio>
                </h:panelGrid>

                <br/>
                <h:panelGroup id="shipmentDetails">
                    <br/>
                    <br/>
                    <br/>

                    <h:outputText value="Delivery Order" style="font-weight: bold; font-size: 110%"/>
                    <h:panelGroup rendered="#{poManagerBean.purchaseOrder.fullShipment}" >
                        <p:separator/>
                        <br/>
                        <h:panelGrid columns="2">
                            <h:outputLabel value="Requested Lead Time: " />
                            <p:calendar value="#{poManagerBean.date1}" onSelectUpdate="purchaseOrderForm" showOn="button" />
                        </h:panelGrid>
                        <br/>
                        <h:panelGrid id="sa1" columns="2">
                            <h:outputLabel value="Address Line 1: "/>
                            <p:inputText size="80" value="#{poManagerBean.newDeliveryOrder.shippingAddress.addressLine1}" disabled="true"/>

                            <h:outputLabel value="Address Line 2: "/>
                            <p:inputText size="80" value="#{poManagerBean.newDeliveryOrder.shippingAddress.addressLine2}" disabled="true"/>

                            <h:outputLabel value="Zip Code: "/>
                            <p:inputMask mask="999999" value="#{poManagerBean.newDeliveryOrder.shippingAddress.zipCode}" disabled="true"/>

                            <h:outputLabel value="City: "/>  
                            <p:inputText size="20" value="#{poManagerBean.newDeliveryOrder.shippingAddress.city}" disabled="true"/>

                            <h:outputLabel value="State: "/>
                            <p:inputText  size="20" value="#{poManagerBean.newDeliveryOrder.shippingAddress.stateName}" disabled="true"/>

                            <h:outputLabel value="Country: "/>
                            <p:inputText size="20" value="#{poManagerBean.newDeliveryOrder.shippingAddress.country}" disabled="true"/>
                        </h:panelGrid>
                        <br/>
                        <div align="right">
                            <p:commandButton value="Get Shipping Address" oncomplete="caDialog.show();" update="caForm"/>
                        </div>
                        <br/><br/>
                        <p:dataTable var="oneIL" rowIndexVar="rowIndex" value="#{poManagerBean.newDeliveryOrder.itemLines}">
                            <p:column headerText="Product Type" rendered="#{poManagerBean.displayItemLine(rowIndex)}">
                                <h:outputText value="#{oneIL.product.productType}"/>
                            </p:column>
                            <p:column headerText="Quantity Ordered Case" rendered="#{poManagerBean.displayItemLine(rowIndex)}">
                                <h:inputText label="Order Quantity" disabled="true" value="#{oneIL.qtyOrderedCase}"/>
                            </p:column>
                        </p:dataTable>
                        <br/>
                        <br/>
                    </h:panelGroup>
                    <h:panelGroup rendered="#{!poManagerBean.purchaseOrder.fullShipment}" >
                        <p:separator/>
                        <br/>
                        <p:fieldset legend="Delivery Order 1">
                            <br/>
                            <h:panelGrid columns="2">
                                <h:outputLabel value="Requested Lead Time: " />
                                <p:calendar value="#{poManagerBean.date1}" onSelectUpdate="purchaseOrderForm" showOn="button" />
                            </h:panelGrid>
                            <br/>
                            <h:panelGrid id="sa2" columns="2">
                                <h:outputLabel value="Address Line 1: "/>
                                <p:inputText size="80" value="#{poManagerBean.newDeliveryOrder.shippingAddress.addressLine1}" disabled="true"/>

                                <h:outputLabel value="Address Line 2: "/>
                                <p:inputText size="80" value="#{poManagerBean.newDeliveryOrder.shippingAddress.addressLine2}" disabled="true"/>

                                <h:outputLabel value="Zip Code: "/>
                                <p:inputMask mask="999999" value="#{poManagerBean.newDeliveryOrder.shippingAddress.zipCode}" disabled="true"/>

                                <h:outputLabel value="City: "/>  
                                <p:inputText size="20" value="#{poManagerBean.newDeliveryOrder.shippingAddress.city}" disabled="true"/>

                                <h:outputLabel value="State: "/>
                                <p:inputText  size="20" value="#{poManagerBean.newDeliveryOrder.shippingAddress.stateName}" disabled="true"/>

                                <h:outputLabel value="Country: "/>
                                <p:inputText size="20" value="#{poManagerBean.newDeliveryOrder.shippingAddress.country}" disabled="true"/>
                            </h:panelGrid>
                            <br/>
                            <div align="right">
                                <p:commandButton value="Get Shipping Address" oncomplete="caDialog.show();" update="caForm"/>
                            </div>
                            <br/><br/>
                            <p:dataTable var="oneIL" rowIndexVar="rowIndex" value="#{poManagerBean.newDeliveryOrder.itemLines}">
                                <p:column headerText="Product Type" rendered="#{poManagerBean.displayItemLine(rowIndex)}">
                                    <h:outputText value="#{oneIL.product.productType}"/>
                                </p:column>
                                <p:column headerText="Quantity Ordered Case" rendered="#{poManagerBean.displayItemLine(rowIndex)}">
                                    <h:inputText label="Order Quantity" required="true" requiredMessage="Please enter order quantity" value="#{oneIL.qtyOrderedCase}"/>
                                </p:column>
                            </p:dataTable>
                            <br/>
                        </p:fieldset>
                        <br/>
                        <br/>
                        <p:fieldset legend="Delivery Order 2">
                            <br/>
                            <h:panelGrid columns="2">
                                <h:outputLabel value="Requested Lead Time: " />
                                <p:calendar value="#{poManagerBean.date2}" onSelectUpdate="purchaseOrderForm" showOn="button" />
                            </h:panelGrid>
                            <br/>

                            <h:panelGrid id="sa3" columns="2">
                                <h:outputLabel value="Address Line 1: "/>
                                <p:inputText size="80" value="#{poManagerBean.newDeliveryOrder2.shippingAddress.addressLine1}" disabled="true"/>

                                <h:outputLabel value="Address Line 2: "/>
                                <p:inputText size="80" value="#{poManagerBean.newDeliveryOrder2.shippingAddress.addressLine2}" disabled="true"/>

                                <h:outputLabel value="Zip Code: "/>
                                <p:inputMask mask="999999" value="#{poManagerBean.newDeliveryOrder2.shippingAddress.zipCode}" disabled="true"/>

                                <h:outputLabel value="City: "/>  
                                <p:inputText size="20" value="#{poManagerBean.newDeliveryOrder2.shippingAddress.city}" disabled="true"/>

                                <h:outputLabel value="State: "/>
                                <p:inputText  size="20" value="#{poManagerBean.newDeliveryOrder2.shippingAddress.stateName}" disabled="true"/>

                                <h:outputLabel value="Country: "/>
                                <p:inputText size="20" value="#{poManagerBean.newDeliveryOrder2.shippingAddress.country}" disabled="true"/>
                            </h:panelGrid>
                            <br/>
                            <div align="right">
                                <p:commandButton value="Get Shipping Address" oncomplete="caDialog2.show();" update="caForm"/>
                            </div>
                            <br/><br/>
                            <p:dataTable var="oneIL" rowIndexVar="rowIndex" value="#{poManagerBean.newDeliveryOrder2.itemLines}">
                                <p:column headerText="Product Type" rendered="#{poManagerBean.displayItemLine(rowIndex)}">
                                    <f:facet name="header" >  
                                        Item Name
                                    </f:facet>
                                    <h:outputText value="#{oneIL.product.productType}" />
                                </p:column>
                                <p:column headerText="Quantity Ordered Case" rendered="#{poManagerBean.displayItemLine(rowIndex)}">
                                    <f:facet name="header">
                                        Quantity Ordered 
                                        <br />
                                        (Case)
                                    </f:facet>
                                    <h:inputText label="Order Quantity" required="true" requiredMessage="Please enter order quantity" value="#{oneIL.qtyOrderedCase}"/>
                                </p:column>
                            </p:dataTable>
                            <br/>
                        </p:fieldset>
                        <br/>
                    </h:panelGroup>
                </h:panelGroup>
                <br/>
            </p:panel>
            <br/>
            <br/>
            <div align="right">
                <p:commandButton value="Next" ajax="false" action="#{poManagerBean.createPurchaseOrder}"/>
            </div>
            <br/>
            <br/>

        </h:form>

        <p:dialog header="Search Customer Address" widgetVar="caDialog" showEffect="fade" hideEffect="fade" height="600" width="800" resizable="false">
            <h:form id="caForm">           
                <br/>
                <p:dataTable var="ca" value="#{poManagerBean.customerAddress}" emptyMessage="No address found"  selection="#{poManagerBean.newDeliveryOrder.shippingAddress}" selectionMode="single">

                    <p:column filterBy="#{ca.addressLine1}" 
                              headerText="Address Line 1" filterMatchMode="contains">
                        <h:outputText value="#{ca.addressLine1}" />
                    </p:column>

                    <p:column filterBy="#{ca.addressLine2}" 
                              headerText="Address Line 2" filterMatchMode="contains">
                        <h:outputText value="#{ca.addressLine2}" />
                    </p:column>

                </p:dataTable>
                <br/>
                <br/>
                <div align="right">
                    <p:commandButton value="Select" update="purchaseOrderForm:sa1 purchaseOrderForm:sa2" oncomplete="caDialog.hide()"/>
                </div>
            </h:form>
        </p:dialog>

        <p:dialog header="Search Customer Address" widgetVar="caDialog2" showEffect="fade" hideEffect="fade" height="600" width="800" resizable="false">
            <h:form id="caForm2">           
                <br/>
                <p:dataTable var="ca" value="#{poManagerBean.customerAddress}" emptyMessage="No address found"  selection="#{poManagerBean.newDeliveryOrder2.shippingAddress}" selectionMode="single">

                    <p:column filterBy="#{ca.addressLine1}" 
                              headerText="Address Line 1" filterMatchMode="contains">
                        <h:outputText value="#{ca.addressLine1}" />
                    </p:column>

                    <p:column filterBy="#{ca.addressLine2}" 
                              headerText="Address Line 2" filterMatchMode="contains">
                        <h:outputText value="#{ca.addressLine2}" />
                    </p:column>

                </p:dataTable>
                <br/>
                <br/>
                <div align="right">
                    <p:commandButton value="Select" update="purchaseOrderForm:sa3" oncomplete="caDialog2.hide()"/>
                </div>
            </h:form>
        </p:dialog>

    </ui:define>

    <ui:define name="bottom">

    </ui:define>

</ui:composition>